<template>
    <div>
        <div class="mar-t">
    <h3>专题精选</h3>
    <van-swipe :loop="false" :height="300" :width="300"  :show-indicators="false">
    <van-swipe-item v-for="(item,index) in topicList" :key="index">
      <a href="#">
        <img :src="item.scene_pic_url" alt="">
      </a>
      <h5>{{item.title}} <span>{{item.price_info | geshi}}</span></h5>
      <div class="van-ellipsis">{{item.subtitle}}</div>
    </van-swipe-item>
    
  </van-swipe>
  </div>
    </div>
</template>

<script>
export default {
    data () {
        return {

 
        }
    },
    props:['topicList']
}
</script>
 
<style lang = "less" scoped>
    .mar-t{
    .van-swipe{
    .van-swipe-item{
      margin-left: 10px;
      
      a{
        display: block;
        width: 300px;
        height: 200px;
        img{
          width: 100%;
          height: 100%;
        }
      }
      h5{
        font-size: 16px;
        margin: 15px 0;
        span{
          color: red;
        }
      }
      div{
        font-size: 14px;
        width: 300px;
      }
      
    }
  }
  }
</style>